import React from 'react'
import {View, Input} from '@tarojs/components'
import './Input.scss'

interface Props {
  searchVal?: string
  className?: string
  placeholder?: string
  focus?: boolean
  onsearchInput?: (e) =>void
  onconfirm?: () => void
  onfocus?: () => void
}

const CustomerInput: React.FC<Props> = React.memo((props) => {
  const {
    searchVal, className = '', placeholder = '搜索...',
    onsearchInput, onconfirm, onfocus, focus = false
  } = props
  return <View className={`search ${className}`}>
    <Input className='search_input'
      style={{paddingLeft: searchVal != null ? '20px' : ""}}
      value={searchVal}
      confirmType='search'
      placeholder={placeholder}
      onInput={onsearchInput}
      onConfirm={onconfirm}
      onFocus={onfocus}
      focus={focus}
    />
    <View className='iconfont'>&#xe8b9;</View>
  </View>
})

export default CustomerInput
